<div class="layui-fluid" id="VIEW-list-table" >
    <div class="layui-row layui-col-space10">
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-header">筛选数据</div>
                <div class="layui-card-body">
                    <div class="layui-row layui-col-space10 layui-form">
                        <form class="layui-form" lay-filter="searchForm">
                            <div class="layui-col-md4">
                                <div class="layui-form-item">
                                    <label class="layui-form-label">角色名称</label>
                                    <div class="layui-input-block">
                                        <input type="text" name="roleName" id="roleName" class="layui-input" placeholder="角色名称"/>
                                    </div>
                                </div>
                            </div>
                            <div class="layui-col-md4 btn-search">
                                <div class="layui-form-item">
                                    <div class="layui-input-block">
                                        <a class="layui-btn search_btn" onclick="roleList.search()">搜索</a>
                                        <button type="reset" class="layui-btn layui-btn-primary search_btn" onclick="roleList.reset()">重置</button>
                                    </div>
                                </div>
                            </div>
                        </form>
                    </div>
                </div>
            </div>
        </div>
        <div class="layui-col-md12">
            <div class="layui-card">
                <div class="layui-card-body nepadmin-table-full">
                    <div class="layui-btn-container nepadmin-pad-t10 nepadmin-pad-l10">
                        <div class="layui-btn layui-btn-sm" onclick="roleList.add()">添加</div>
                    </div>
                    <table id="roleListId" lay-filter="roleList"></table>
                </div>
            </div>
        </div>

    </div>
    <script type="text/html" id="TPL-list-table-status">
        {{#
        var status = {
        '0':{title:'禁用',color:'red'},
        '1':{title:'启用',color:'blue'}
        }[d.status];
        }}
        <span class="layui-badge layui-bg-{{status.color}}">{{ status.title }}</span>
    </script>
    <script type="text/html" id="barDemo">
        <a class="layui-btn layui-btn-primary layui-btn-xs" lay-event="authorization">权限</a>
        <a class="layui-btn layui-btn-xs" lay-event="edit">编辑</a>
        <a class="layui-btn layui-btn-danger layui-btn-xs" lay-event="del">删除</a>
    </script>
</div>
<script>
    var roleList = {};
    var RoleList = function (layui) {
        var admin = layui.admin, table = layui.table, form = layui.form, $ =layui.jquery,treeGrid = layui.treeGrid;
        //初始化列表
        this.init = function () {
            form.render();
            admin.table({
                elem: '#roleListId',
                api: 'pageRoleList',
                height: 'full-240',
                formFilter: 'searchForm',
                tableFilter:'roleList',
                cols: [[
                    {title: '序号', type: 'numbers', fixed: true},
                    {title: '角色名称', field: 'roleName'},
                    {title: '备注', field: 'remark'},
                    {title: '创建人', field: 'creatorName'},
                    {
                        field: 'lastLoginTime',
                        sort: true,
                        title: '创建时间',
                        align: 'center',
                        templet:function (d) {
                            if(d.createTime){
                                return '<p><span title="{{d.createTime}}" class="nepadmin-c-gray">'+d.createTime+'</span></p>';
                            }else{
                                return "";
                            }
                        }
                    }
                    ,{title: '操作',fixed: 'right', width: 170, align:'center', toolbar: '#barDemo'}
                ]],
                tools:{
                    //修改
                    edit:function (row) {
                        admin.popup({
                            title:'修改角色',
                            url:'/sys/role/edit',
                            area: ['40%', '40%'],
                            data: row,
                            success:function (layer, index) {
                                var editRole = new EditRole(admin,form,layer, index,$);
                                editRole.init();
                            }
                        });
                    },
                    del:function (row) {
                        admin.confirm("是否删除？",function () {
                            var roleIds = [];
                            roleIds.push(row.roleId);
                            admin.post({
                                api:'deleteRoles',
                                data:JSON.stringify(roleIds),
                                contentType: 'application/json;charset=UTF-8',
                                success:function (res) {
                                    if(res.code == 0){
                                        admin.success('操作成功',function () {
                                            roleList.search();
                                        });
                                    }
                                }
                            });
                        })
                    },
                    //授权
                    authorization:function (row) {
                        admin.popup({
                            title:'编辑权限',
                            url:'/sys/role/authorization',
                            type: 3,
                            data: row,
                            success:function (layer, index) {
                                var authorization = new Authorization();
                                authorization.init();
                            }
                        });
                    }
                }
            });
        };
        //新增
        this.add = function () {
            admin.popup({
                title:'新增角色',
                url:'/sys/role/add',
                area: ['40%', '40%'], //宽高
                success:function (layer, index) {
                   var addRole = new AddRole(admin,form,layer, index,$);
                    addRole.init();
                }
            });
        };
        //条件搜索
        this.search = function () {
            admin.tableSearch('searchForm','roleListId',true);
        };
        //刷新表格当前页
        this.refresh = function () {
            admin.tableSearch('searchForm','userListId');
        };
        //重置搜索条件
        this.reset = function () {
            $("#roleName").val("");
        };
    };
    //引入组件
    layui.use(['admin', 'table', 'form', 'jquery','treeGrid'], function () {
        roleList = new RoleList(layui);
        roleList.init();
    });
</script>